<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
  <meta name="description" content="">
  <meta name="author" content="ThemeBucket">
  <link rel="shortcut icon" href="#" type="image/png">
    <script src="/static/img/js/addGoods.js"></script>
    <!--file upload-->
    <link rel="stylesheet" type="text/css" th:href="@{static/css/bootstrap-fileupload.min.css}" />
  <title>乐在购物商家后台—账户设置</title>

    <link th:include="common/common_mer :: #com_css">
    <!--图片裁剪-->
    <link rel="stylesheet" type="text/css" href="/static/plug-in/image-cut/css/normalize.css" />
    <style>
        #clipArea {
            margin: 20px;
            height: 300px;
        }
        #file,
        #clipBtn {
            margin: 20px;
        }
        #view {
            margin: 0 auto;
            width: 200px;
            height: 200px;
        }
    </style>
</head>

<body class="sticky-header">

<section>
    <!--左部标签栏-->
    <div th:replace="common/common_mer :: #com_leftmenu"></div>
    
    <!-- main content start-->
    <div class="main-content" >
        <!--顶部导航栏-->
        <div th:replace="common/common_mer :: #com_headermenu"></div>
        <div class="top"></div>
        <!--主体内容 start-->
        <div class="wrapper">
            <div class="row">
                <div class="col-sm-12">
                    <div class="panel panel-warning">
                        <div class="panel-heading">
                            修改账户信息
                            <span class="tools pull-right">
                                <a href="javascript:;" class="fa fa-chevron-down"></a>
                             </span>
                        </div>
                        <div class="panel-body">
                            <div class="adv-table">
                                <form class="form-horizontal" th:action="@{/modify_account}" role="form" id="accountFrom" method="post" enctype="multipart/form-data">
                                    <!--提示信息-->
                                    <div th:replace="common/common_mer :: #com_alert"></div>
                                    <h3>个人信息</h3>
                                    <!--商户姓名-->
                                    <div class="form-group">
                                        <label for="name" class="col-lg-2 col-sm-2 control-label"><strong>商户姓名</strong></label>
                                        <div class="col-lg-10">
                                            <input type="text" th:value="${session.store.boss_name}" maxlength="15" oninput="titleInput('name','t_name',15)" name="name" class="form-control" id="name" placeholder="商户姓名" required>
                                            <p th:id="t_name" class="help-block">（字数限制1~15字）</p>
                                        </div>
                                    </div>
                                    <!--性别-->
                                    <div class="form-group">
                                        <label for="gender" class="col-lg-2 col-sm-2 control-label"><strong>性别</strong></label>
                                        <div class="col-lg-10">
                                            <input type="hidden" id="sex" th:value="${session.merchants.gender}">
                                            <select class="form-control" id="gender" name="gender" required>
                                                <option value="男">男</option>
                                                <option value="女">女</option>
                                            </select>
                                        </div>
                                    </div>
                                    <!--邮箱-->
                                    <div class="form-group">
                                        <label for="email" class="col-lg-2 col-sm-2 control-label"><strong>邮箱</strong></label>
                                        <div class="col-lg-10">
                                            <input type="email" th:value="${session.merchants.email}" name="email" class="form-control" id="email" placeholder="邮箱" title="点击设置邮箱" onclick="ver_email()" required readonly>
                                        </div>
                                    </div>
                                    <hr/>
                                    <h3>店铺信息</h3>
                                    <!--店铺名称-->
                                    <div class="form-group">
                                        <label for="store_name"class="col-lg-2 col-sm-2 control-label"><strong>店铺名称</strong></label>
                                        <div class="col-lg-10">
                                            <input type="text" th:value="${session.store.store_name}" oninput="titleInput('store_name','t_store_name',20)" name="store_name" class="form-control" id="store_name" placeholder="店铺名称" required>
                                            <p id="t_store_name" class="help-block">（字数限制1~20字）</p>
                                        </div>
                                    </div>
                                    <!--店铺介绍-->
                                    <div class="form-group">
                                        <label for="store_introduce" class="col-lg-2 col-sm-2 control-label"><strong>店铺介绍</strong></label>
                                        <div class="col-lg-10">
                                            <textarea class="form-control" name="store_introduce" maxlength="150" oninput="titleInput('store_introduce','t_store_introduce',150)" rows="3" id="store_introduce" th:text="${session.store.store_introduce}" required></textarea>
                                            <p id="t_store_introduce" class="help-block">（字数限制1~150字）</p>
                                        </div>
                                    </div>
                                    <!--店铺地址-->
                                    <div class="form-group">
                                        <label for="address" class="col-lg-2 col-sm-2 control-label"><strong>店铺地址</strong></label>
                                        <div class="col-lg-10">
                                            <input type="text" th:value="${session.merchants.address}" oninput="titleInput('address','t_address',30)" name="address" class="form-control" id="address" placeholder="店铺地址" required>
                                            <p id="t_address" class="help-block">（字数限制2~30字）</p>
                                        </div>
                                    </div>
                                    <!--店铺图片-->
                                    <div class="form-group">
                                        <label for="image" class="col-lg-2 col-sm-2 control-label"><strong>店铺图片</strong></label>
                                        <div class="col-lg-10">
                                            <div class="text-center" style="background-color: #d6d6d6;display: table;padding: 8px" data-toggle="modal" data-target="#img_cut">
                                                <div id="show" th:style="${'width: 150px;height: 150px;background-color: white;background-repeat: no-repeat; background-position: center center; background-size: contain;background-image: url(/fileload/show/'+session.store.store_image+')'}"></div>
                                                <span class="btn btn-default" style="margin-top: 8px"><i class="fa fa-picture-o"></i> 选择图片</span>
                                            </div>
                                            <input id="image" type="hidden" name="image" />
                                        </div>
                                    </div>
                                    <!-- 图片裁剪模态框（Modal） -->
                                    <div class="modal fade" id="img_cut" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                                        <div class="modal-dialog">
                                            <div class="modal-content">
                                                <div class="modal-header">
                                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                                                        &times;
                                                    </button>
                                                    <h4 class="modal-title" id="myModalLabel">
                                                        选择图片裁剪
                                                    </h4>
                                                </div>
                                                <div class="modal-body">
                                                    <div class="row">
                                                        <div id="clipArea"></div>
                                                    </div>
                                                    <div class="row text-center">
                                                        <div class="col-md-9">
                                                            <input type="file" id="file">
                                                        </div>
                                                        <div class="col-md-3">
                                                            <button class="btn btn-search btn-lg" id="clipBtn" onsubmit="return false;" onclick="return false;">截取图片</button>
                                                        </div>
                                                    </div>
                                                    <div class="row">
                                                        <div id="view" style="background-repeat: no-repeat; background-position: center center; background-size: contain;"></div>
                                                    </div>
                                                </div>
                                                <div class="modal-footer">
                                                    <button type="button" class="btn btn-default" data-dismiss="modal">
                                                        关闭
                                                    </button>
                                                </div>
                                            </div><!-- /.modal-content -->
                                        </div><!-- /.modal -->
                                    </div>
                                    <!--店铺注册时间-->
                                    <div class="form-group">
                                        <label for="start_time" class="col-lg-2 col-sm-2 control-label"><strong>注册时间</strong></label>
                                        <div class="col-lg-10">
                                            <p id="start_time" class="help-block" th:text="${session.store.start_time}"></p>
                                        </div>
                                    </div>
                                    <hr/>
                                    <h3>账户信息</h3>
                                    <!--用户名-->
                                    <div class="form-group">
                                        <label for="account" class="col-lg-2 col-sm-2 control-label"><strong>用户名</strong></label>
                                        <div class="col-lg-10">
                                            <input type="text" th:value="${session.merchants.account}" oninput="titleInput('account','t_account',20)" name="account" class="form-control" id="account" placeholder="用户名（昵称）" required>
                                            <p id="t_account" class="help-block">（字数限制1~18字）</p>
                                        </div>
                                    </div>
                                    <!--密码-->
                                    <div class="form-group">
                                        <label for="password" class="col-lg-2 col-sm-2 control-label"><strong class="text-danger">* 密码（必填）</strong></label>
                                        <div class="col-lg-10">
                                            <input type="password" name="password" class="form-control" oninput="titleInput('password','t_password',18)" id="password" placeholder="请输入密码" required>
                                            <p id="t_password" class="help-block">（字数限制6~18字）</p>
                                        </div>
                                    </div>
                                    <!--提交-->
                                    <div class="form-group">
                                        <div class="col-lg-offset-2 col-lg-10">
                                            <button class="btn btn-success btn-lg submit" type="submit">提交修改</button>
                                            <label class="help-block">（修改信息需要填写密码验证）</label>
                                        </div>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--主体内容 end-->
        <div class="bottom"></div>
        <div th:replace="common/common_mer :: #com_footer"></div>
    </div>
    <!-- main content end-->
</section>

<!-- 设置邮箱Modal -->
<div class="modal fade" id="email_model" role="dialog" tabindex="-1" aria-labelledby="myModalLabel" aria-hidden="true" >
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">设置邮箱</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal" role="form">
                    <div class="form-group new-email">
                        <label class="col-md-2 control-label">邮箱:</label>
                        <div class="col-md-7">
                            <input type="email" name="my_email" class="form-control" id="my_email" placeholder="请输入新的邮箱" required>
                        </div>
                    </div>
                    <div class="form-group new-email">
                        <label class="col-lg-2 control-label">验证码:</label>
                        <div class="col-lg-4">
                            <input type="text" class="form-control" id="email_code" placeholder="请输入邮箱验证码" required>
                        </div>
                    </div>
                    <div class="form-group new-email">
                        <label class="col-md-2 control-label"></label>
                        <div class="col-md-7">
                            <input type="button" class="btn btn-search get_code" value="获取验证码">
                            <input type="button" class="btn btn-info ver_code" hidden value="验证邮箱">
                        </div>
                    </div>
                </form>
                <script src="/static/my_js/encryp/md5.js"></script>
            </div>
            <div class="modal-footer">
                <button data-dismiss="modal" class="btn btn-default" type="button">取消</button>
                <button class="btn btn-primary ver_code" hidden>确定</button>
            </div>
        </div>
    </div>
</div>
<!-- modal -->

<script src="/static/my_js/encryp/md5.js"></script>

<div th:replace="common/common_mer :: #com_js"></div>
<!--图片裁剪-->
<script src="/static/plug-in/image-cut/js/iscroll-zoom.js"></script>
<script src="/static/plug-in/image-cut/js/hammer.js"></script>
<script src="/static/plug-in/image-cut/js/lrz.all.bundle.js"></script>
<script src="/static/plug-in/image-cut/js/jquery.photoClip.js"></script>

<script src="/static/my_js/img-cut.js"></script>
<script src="/static/my_js/input.js"></script>
<script src="/static/my_js/mer/modifyAccount.js"></script>

<script type="text/javascript" th:src="@{/static/js/bootstrap-fileupload.min.js}"></script>
<script>
    var val=$("#sex").val();
    set_select_checked('gender',val);
</script>
</body>
</html>
